<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="../fonts/element-icons.ttf">
    <link rel="stylesheet" href="../fonts/element-icons.woff">
    <link rel="stylesheet" href="../css/ele.css">
    <script src="../js/vue.js"></script>
    <script src="../js/axios.min.js"></script>
    <script src="../js/url.js"></script>
    <!-- <script src="../node_modules/element-ui/lib/index.js"></script> -->
    <script src="../js/ele.js"></script>
    <link rel="stylesheet" href="../css/public.css">
    <link rel="stylesheet" href="../css/user.css">
    <script src="../js/Mixin.js"></script>
    <script src="../js/crypto-js.min.js"></script>
    <script src="../js/aes.js"></script>
</head>

<body>
    <div id="app">
        <!-- 头部 -->
        <header>
            <div class="heart ng-scope" ng-controller="HeartForm">
                <div class="logo" @click="goHome">
                    <img src="../image/index/logo.png" alt="" style="width: 123px;height: 59px;margin-top: 8px;">
                    <div style="width: 1px;
                height: 24px;
                background: #333333;
                margin-top: 7%;
                margin-right: 9px;"></div>
                    <div>留学大数据，智能选校专家</div>
                </div>
                <el-menu :default-active="activeIndex" class="el-menu-demo" mode="horizontal" @select="menuSelect">
                    <el-submenu index="1">
                        <template slot="title">产品</template>
                        <div class="chanpin">
                            <ul class="unav">
                                <li :class="[activenavliIndex==0?'activenavli':'']" @click="unavclcik(0)">全球院校库</li>
                                <li :class="[activenavliIndex==1?'activenavli':'']" @click="unavclcik(1)">智能选校系统</li>
                            </ul>
                            <div style="margin-left: 53px;" v-if="activenavliIndex==0">
                                <div class="ltitle"> <img src="../image/index/quanqiu.png" alt=""
                                        style="width: 26px;vertical-align: bottom;">
                                    全球院校库</div>
                                <div class="lcontent">
                                    <!-- <div> -->
                                    <ul v-for="(item,index) in headerList" :key="index">
                                        <li>{{item.name}}</li>
                                        <li v-for="i in item.universityItems" @click="qqyxkClick(item.id,i.id)">
                                            {{i.name}}院校库
                                        </li>
                                    </ul>
                                </div>
                            </div>
                            <div style="margin-left: 53px;" v-if="activenavliIndex==1">
                                <div class="ltitle"> <img src="../image/index/quanqiu.png" alt=""
                                        style="width: 26px;vertical-align: bottom;">
                                    智能选校系统</div>
                                <div class="lcontent">
                                    <div>
                                        <ul>
                                            <li v-for="(i,index) in znxxxtList" :key="index" style="font-size: 12px;"
                                                @click="znxxxtSearch(i)">
                                                {{i.name}}</li>

                                        </ul>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </el-submenu>
                    <el-menu-item index="2">会员</el-menu-item>
                    <el-menu-item index="3">套餐</a></el-menu-item>
                    <el-menu-item index="4">合作</a></el-menu-item>

                </el-menu>
                <div class="user_box" id="user_box">
                    <div v-if="isLogin">
                        <el-dropdown trigger="click">
                            <span class="el-dropdown-link">
                                <img :src="HeadImageUrl" alt=""
                                    style="width: 33px;height: 33px; vertical-align: middle;margin-right: 8px;">
                                {{nickname}}<i class="el-icon-arrow-down el-icon--right"></i>
                            </span>
                            <el-dropdown-menu slot="dropdown">
                                <el-dropdown-item icon="el-icon-user" @click.native="goUser">个人中心</el-dropdown-item>
                                <el-dropdown-item icon="el-icon-layout"
                                    @click.native="layoutLogin">退出登录</el-dropdown-item>
                            </el-dropdown-menu>
                        </el-dropdown>
                    </div>
                    <div v-else @click="login"><img src="../image/index/user.png" alt=""
                            style="width: 22px;vertical-align: middle;"> <a href="./login.html">登录</a>/ <a
                            href="./register.html">注册</a> </div>
                </div>
            </div>
        </header>
        <div class="userContent">
            <ul>
                <li :class="[uactiveIndex==0?'active':'']" @click="navClick(0)">会员明细</li>
                <li :class="[uactiveIndex==1?'active':'']" @click="navClick(1)">我的订单</li>
                <li :class="[uactiveIndex==2?'active':'']" @click="navClick(2)">账号管理</li>
            </ul>
            <div class="rightcontent0" v-if="uactiveIndex==0">
                <div style="margin-bottom: 17px;">
                    <div class="title">会员资料</div>
                    <div style="display: flex;justify-content: space-between;align-items: flex-start;">
                        <div style="display: flex;align-items: center;">
                            <img v-if="basicInfo.headImageUrl" :src="basicInfo.headImageUrl" alt=""
                                style="border-radius: 50%;">
                            <img v-else src="../image/index/header.png" alt="">
                            <div class="info">
                                <!-- UserNew=0,//新注册用户，User=1, //注册用户；userVIP=21,//VIP会员；userSVIP=22 //SVIP会员 -->
                                <div>{{nickname}} <span
                                        class="vip">{{basicInfo.membType==0?'新注册用户':basicInfo.membType==1?'注册用户':basicInfo.membType==21?'VIP':'SVIP'}}</span>
                                </div>
                                <div style="font-size: 13px;margin-top: 13px;">{{basicInfo.membTypeZnName}}
                                    | {{memberInfo.endTime}}
                                    到期</div>
                            </div>
                        </div>
                        <div style="margin-right: 110px;">
                            <div style="font-size: 13px;">剩余Code码数量</div>
                            <div style="font-weight: 500; font-size: 33px;margin: 13px 0;">{{memberInfo.CodeNumber}}
                            </div>
                            <div @click="fuelBag"
                                style="width: 63px;height: 25px;text-align: center;line-height: 25px;background: #e6f5ff;color: #0094FF;font-size: 12px;border-radius: 5px;cursor: pointer;">
                                购买套餐</div>
                        </div>
                    </div>
                </div>
                <div style="height: 57vh;">
                    <div class="title">会员明细</div>
                    <el-table :data="tableData" style="width: 100%">
                        <el-table-column prop="orderId" label="订单编号" width="180">
                        </el-table-column>
                        <el-table-column prop="orderName" label="商品名称" width="180">
                        </el-table-column>
                        <el-table-column prop="orderAmount" label="金额">
                        </el-table-column>
                        <!-- <el-table-column prop="num" label="查询次数">
                        </el-table-column> -->
                        <el-table-column prop="orderPayTime" label="购买日期">
                        </el-table-column>
                        <el-table-column prop="orderEndTime" label="code码到期时间">
                        </el-table-column>
                        <el-table-column prop="orderDescri" label="权限说明">
                        </el-table-column>
                    </el-table>
                </div>
            </div>
            <div class="rightcontent" v-if="uactiveIndex==1">
                <div class="title">我的订单</div>
                <el-table :data="tableData1" style="width: 100%">
                    <el-table-column prop="orderId" label="订单编号" width="180">
                    </el-table-column>
                    <el-table-column prop="orderName" label="商品名称" width="180">
                    </el-table-column>
                    <el-table-column prop="orderAmount" label="金额">
                    </el-table-column>
                    <!-- <el-table-column prop="num" label="查询次数">
                    </el-table-column> -->
                    <el-table-column prop="orderPayTime" label="购买日期">
                    </el-table-column>
                    <el-table-column prop="orderEndTime" label="code码到期时间">
                    </el-table-column>
                    <el-table-column prop="orderDescri" label="权限说明">
                    </el-table-column>
                </el-table>
            </div>
            <div class="rightcontent0" v-if="uactiveIndex==2">
                <div style="margin-bottom: 17px;">
                    <div class="title">个人资料</div>
                    <div style="display: flex;align-items: center;">
                        <img v-if="basicInfo.headImageUrl" :src="basicInfo.headImageUrl" alt=""
                            style="border-radius: 50%;">
                        <img v-else src="../image/index/header.png" alt="">
                        <div style="width: 70px;
                        height: 35px;text-align: center;line-height: 35px;margin-left: 20px;
                        background: #FAFAFA;
                        border-radius: 5px 5px 5px 5px;font-size: 13px;cursor: pointer;">修改头像</div>
                    </div>
                    <div class="userform">
                        <div>
                            <div>
                                <p>昵称</p>
                                <el-input v-model="userForm.nickname"></el-input>
                            </div>
                            <div>
                                <p>用户ID</p>
                                <el-input v-model="userForm.accountId" disabled></el-input>
                            </div>
                        </div>
                        <div>
                            <div>
                                <p>性别</p>
                                <el-input v-model="userForm.sex"></el-input>
                            </div>
                            <div>
                                <p>手机号</p>
                                <el-input v-model="userForm.phoneId" disabled></el-input>
                            </div>
                        </div>
                        <button style="width: 172px;
                        height: 35px;margin-top: 27px;
                        background: #0094FF;" @click="editZiliao">修改资料</button>
                    </div>
                </div>
                <div class="editPassword">
                    <p class="title">修改密码</p>
                    <el-form :model="passInfo" :rules="rules" ref="ruleForm" class="demo-ruleForm">
                        <el-form-item label="" prop="currpassw">

                            <el-input v-model="passInfo.currpassw" show-password placeholder="当前密码"></el-input>

                        </el-form-item>
                        <el-form-item label="" prop="passw">
                            <div> <el-input v-model="passInfo.passw" show-password placeholder="新密码"></el-input></div>
                        </el-form-item>
                        <el-form-item label="" prop="confirmPassw">
                            <div> <el-input v-model="passInfo.confirmPassw" show-password
                                    placeholder="确认新密码"></el-input>
                            </div>
                        </el-form-item>
                    </el-form>
                    <button style="width: 172px;
                        height: 35px;
                        background: #0094FF;" @click="editPassword">确认修改密码</button>
                </div>
            </div>
        </div>
        <footer>2023-2024 非攻留学大数据 版权所有 feigongdata.com 浙ICP备2024101258号-1</footer>


    </div>
</body>
<script>
    var app = new Vue({
        mixins: [myMixin],
        el: "#app",
        data() {
            var validatePass2 = (rule, value, callback) => {
                console.log(111, value);
                if (!value) {
                    callback(new Error('请再次输入密码'));
                } else if (value !== this.passInfo.passw) {
                    callback(new Error('两次输入密码不一致!'));
                } else {
                    callback();
                }
            };
            return {
                rules: {
                    currpassw: [
                        { required: true, message: '请输入当前密码', trigger: 'blur' }
                    ],
                    passw: [
                        { required: true, message: '请输入新密码', trigger: 'blur' }
                    ],
                    confirmPassw: [
                        { validator: validatePass2, trigger: 'blur' }
                    ],

                },
                uactiveIndex: 0,
                tableData: [],
                tableData1: [],
                activeIndex: '1',
                activenavliIndex: 0,
                titleList: ['会员', '套餐', '合作'],
                isLogin: false,
                userForm: {},
                memberInfo: {},
                totalPrice: '',
                isZfb: false,
                passInfo: {},
            }
        },
        created() {
            // Object.assign(this.userForm, this.basicInfo)

            http('userdata/memberInfo', 'post').then(res => {
                console.log('memberInfo', JSON.parse(Decrypt(res.data)));
                let data = JSON.parse(Decrypt(res.data))
                this.memberInfo = data
                http('productdata/memberpricelists?membtype=' + this.memberInfo.membType, 'post').then(res => {
                    console.log('memberpricelists', JSON.parse(Decrypt(res.data)));
                    let data = JSON.parse(Decrypt(res.data))
                })
            })

            http('tradedata/historyorderQuery?querytype=0', 'post').then(res => {
                let data = JSON.parse(Decrypt(res.data))
                console.log(data);
                this.tableData = data
            })

        },
        methods: {
            navClick(index) {
                this.uactiveIndex = index
                if (index == 0) {
                    http('tradedata/historyorderQuery?querytype=0', 'post').then(res => {
                        let data = JSON.parse(Decrypt(res.data))
                        console.log(data);
                        this.tableData = data
                    })
                }
                if (index == 1) {
                    this.tableData1 = []
                    http('tradedata/historyorderQuery?querytype=1', 'post').then(res => {
                        let data = JSON.parse(Decrypt(res.data))
                        console.log(data);
                        this.tableData1.push(...data)
                    })
                    http('tradedata/historyorderQuery?querytype=2', 'post').then(res => {
                        let data = JSON.parse(Decrypt(res.data))
                        console.log(data);
                        this.tableData1.push(...data)
                    })
                }
                if (index == 2) {
                    this.userForm = this.basicInfo
                    console.log(this.userForm, 'this.userForm');
                }
            },
            unavclcik(index) {
                console.log(index);
                this.activenavliIndex = index
            },
            login() {
                window.location.href = './login.html'
            },
            goHome() {
                window.location.href = './index.html'
            },
            fuelBag() {
                location.href = './memberNewUser.html'
            },
            editZiliao() {
                http('userdata/editbasicInfo', 'post', this.userForm).then(res => {
                    if (res.status == 0) {
                        this.$message.success('修改成功')
                    }
                    console.log(res);

                })
            },
            editPassword() {
                this.$refs.ruleForm.validate((valid) => {
                    if (valid) {
                        http('userdata/editpswInfo', 'post', this.passInfo).then(res => {
                            if (res.status == 0) {
                                this.$message.success('修改成功')
                            } else {
                                this.$message.error('修改失败')
                            }
                            console.log(res);
                        })
                    }
                })

            }
        }
    })
</script>
<style>
    .demo-ruleForm {
        width: 333px;
    }
</style>

</html>